page {
    height: 100%;
}

.category {
    height: 100%;

    .container {
        height: calc(100vh - 90rpx);
        display: flex;

        .left {
            flex: 2.2;

            .item {
                height: 100rpx;
                font-size: 32rpx;
                line-height: 100rpx;
                text-align: center;
            }

            .actived {
                border-left: 5px solid var(--themeColor);
                color: var(--themeColor);
                font-size: 36rpx;
            }
        }

        .right {
            flex: 5;

            .right_item {
                width: 100%;

                .right_title {
                    width: 100%;
                    text-align: center;
                    font-size: 36rpx;
                    height: 80rpx;
                    line-height: 80rpx;
                    margin-top: 20rpx;
                }

                .right_container {
                    width: 100%;
                    display: flex;
                    flex-wrap: wrap;

                    .right_container_item {
                        width: 33.3%;
                        padding: 0 20rpx;

                        .right_pic {
                            width: 100%;
                        }

                        .name {
                            width: 100%;
                            text-align: center;
                            font-size: 30rpx;
                        }
                    }
                }
            }
        }
    }
}